﻿@{
    Layout = "_ZjcLayout";
    ViewData["Title"] = "政教处";
}
    <fieldset class="layui-elem-field" style="margin: 20px 15px">
        <legend>物资申请审核</legend>
        <div class="layui-field-box">

            <div class="layui-col-xs8 layui-col-md8">
                <form class="layui-form" action="">
                    <div class="grid-demo grid-demo-bg1">
                        <div class="demoTable">
                            <div class="layui-inline">
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <span>按物资名称查询：</span>
                                    </div>
                                    <div class="layui-inline">
                                        <input class="layui-input" name="materialName" id="searchMaterByName" autocomplete="off">
                                    </div>
                                    <div class="layui-inline">
                                        <button class="layui-btn" lay-submit="" type="submit" lay-filter="materialSearch">搜索</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="layui-col-xs4 layui-col-md4">
                <div class="grid-demo grid-demo-bg1">
                    <div class="demoTable">
                        <div class="layui-inline">
                            <div class="layui-form layui-form-item">
                                <div class="layui-inline">
                                    <span>按部门筛选：</span>
                                </div>
                                <div class="layui-inline">
                                    <select lay-filter="section" name="section">
                                        <option value="">请选择部门</option>
                                        <option value="教师">教师</option>
                                        <option value="政教处">政教处</option>
                                        <option value="校长">校长</option>
                                        <option value="财务处">财务处</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-row">
                <table class="layui-hide" id="materialApply" lay-filter="material"></table>
            </div>
        </div>
    </fieldset>



@section Scripts{
    <script src="~/layui-v2.5.5/layui/layui.all.js" charset="utf-8"></script>
    <script src="~/js/jquery.js"></script>
    <script type="text/html" id="button1">
        {{#  if(d.state === '拒绝'){ }}
        <span style="color: #D52B2B;">{{ d.state }}</span>
        {{#  } else if(d.state === '同意') { }}
        <span style="color:#3BA250;">{{ d.state }}</span>
        {{#  } else { }}
        <span style="color: #1111EE;">{{ d.state }}</span>
        {{#  } }}
    </script>
    <script>
        layui.use(['form', 'table'], function () {
            var table = layui.table,
                form = layui.form;
            table.render({
                elem: '#materialApply'
                , url: '/Api/QueryAllMaterialApply'
                , cols: [[
                    { field: 'id', title: '编号', width: "10%", sort: true, event: 'materialset', style: 'cursor: pointer;' }
                    , { field: 'teacherName', title: '申请人名称', width: "10%" }
                    , { field: 'goodsNum', title: '所购货物数量', width: "10%" }
                    , { field: 'goodsPrice', title: '所购货物单价', width: "10%", sort: true }
                    , { field: 'goodsName', title: '所购货物名称', width: "20%" }
                    , { field: 'remarks', title: '申请原由', width: "20%" }
                    , { field: 'sectionName', title: '所属部门名称', width: "10%" }
                    , { field: 'state', title: '审核状态', minWidth: 50 , templet: '#button1'}
                ]]
                , page: true
                , height:472
            });
            //监听物资表单元格事件
            table.on('tool(material)', function (obj) {
                var data = obj.data;
                if (obj.event === 'materialset') {
                    layer.open({
                        type: 2,
                        area: ['500px', '520px'],
                        title: '物资审核处理',
                        content: ['/ZJC/HandleMaterial?id=' + data.id, 'no'],
                    });
                }
            });
            //监听搜索提交
            form.on('submit(materialSearch)', function (data) {
                var loading = layer.msg('数据加载中', {
                    icon: 16
                    , shade: 0.01
                });
                console.log(data);
                $.ajax({
                    url: '/Api/QueryMaterialByMaterialName',
                    data: {
                        materilName: data.field.materialName
                    },
                    type: "POST",
                    dataType: "JSON",
                    success: function (res) {
                        switch (res.code) {
                            case 0:
                                table.render({
                                    elem: '#materialApply'
                                    , cols: [[
                                        { field: 'id', title: '编号', width: "10%", sort: true, event: 'materialset', style: 'cursor: pointer;' }
                                        , { field: 'teacherName', title: '申请人名称', width: "10%" }
                                        , { field: 'goodsNum', title: '所购货物数量', width: "10%" }
                                        , { field: 'goodsPrice', title: '所购货物单价', width: "10%", sort: true }
                                        , { field: 'goodsName', title: '所购货物名称', width: "20%" }
                                        , { field: 'remarks', title: '申请原由', width: "20%" }
                                        , { field: 'sectionName', title: '所属部门名称', width: "10%" }
                                        , { field: 'state', title: '审核状态', minWidth: 50,templet: '#button1' }
                                    ]]
                                    , data: res.data
                                    , page: true
                                    , height:472
                                });
                                break;
                            case 270:
                                layer.alert("没有与之匹配的数据", { icon: 2 });
                                break;
                            case 280:
                                //方法级渲染
                                table.render({
                                    elem: '#materialApply'
                                    , url: '/Api/QueryAllMaterialApply'
                                    , cols: [[
                                        { field: 'id', title: '编号', width: "10%", sort: true, event: 'materialset', style: 'cursor: pointer;' }
                                        , { field: 'teacherName', title: '申请人名称', width: "10%" }
                                        , { field: 'goodsNum', title: '所购货物数量', width: "10%" }
                                        , { field: 'goodsPrice', title: '所购货物单价', width: "10%", sort: true }
                                        , { field: 'goodsName', title: '所购货物名称', width: "20%" }
                                        , { field: 'remarks', title: '申请原由', width: "20%" }
                                        , { field: 'sectionName', title: '所属部门名称', width: "10%" }
                                        , { field: 'state', title: '审核状态', minWidth: 50,templet: '#button1'}
                                    ]]
                                    , page: true
                                    , height:472
                                });
                                break;
                            default:
                                layer.alert("数据异常，请重新尝试！", { icon: 3 });
                        }
                        layer.close(loading);
                    }
                })
                return false;
            });
            //监听部门筛选
            form.on('select(section)', function (data) {
                var loading = layer.msg('数据加载中', {
                    icon: 16
                    , shade: 0.01
                });
                $.ajax({
                    url: '/Api/QueryMaterialBySection',
                    data: { section: data.elem.value },
                    type: "POST",
                    dataType: "JSON",
                    success: function (res) {
                        switch (res.code) {
                            case 200:
                                table.render({
                                    elem: '#materialApply'
                                    , cols: [[
                                        { field: 'id', title: '编号', width: "10%", sort: true, event: 'materialset', style: 'cursor: pointer;' }
                                        , { field: 'teacherName', title: '申请人名称', width: "10%" }
                                        , { field: 'goodsNum', title: '所购货物数量', width: "10%" }
                                        , { field: 'goodsPrice', title: '所购货物单价', width: "10%", sort: true }
                                        , { field: 'goodsName', title: '所购货物名称', width: "20%" }
                                        , { field: 'remarks', title: '申请原由', width: "20%" }
                                        , { field: 'sectionName', title: '所属部门名称', width: "10%" }
                                        , { field: 'state', title: '审核状态', minWidth: 50,templet: '#button1'}
                                    ]]
                                    , data: res.data
                                    , page: true
                                    , height:472
                                });
                                break;
                            case 270:
                                layer.alert("没有与之匹配的数据", { icon: 2 });
                                break;
                            case 280:
                                //方法级渲染
                                table.render({
                                    elem: '#materialApply'
                                    , url: '/Api/QueryAllMaterialApply'
                                    , cols: [[
                                        { field: 'id', title: '编号', width: "10%", sort: true, event: 'materialset', style: 'cursor: pointer;' }
                                        , { field: 'teacherName', title: '申请人名称', width: "10%" }
                                        , { field: 'goodsNum', title: '所购货物数量', width: "10%" }
                                        , { field: 'goodsPrice', title: '所购货物单价', width: "10%", sort: true }
                                        , { field: 'goodsName', title: '所购货物名称', width: "20%" }
                                        , { field: 'remarks', title: '申请原由', width: "20%" }
                                        , { field: 'sectionName', title: '所属部门名称', width: "10%" }
                                        , { field: 'state', title: '审核状态', minWidth: 50,templet: '#button1'}
                                    ]]
                                    , page: true
                                    , height:472
                                });
                                break;
                            default:
                                layer.alert("数据异常，请重新尝试！", { icon: 3 });
                        }
                        layer.close(loading);
                    }
                })
            })
        });
    </script>
}